/*----------框架页面start-----------*/
/*顶部*/
html {
	height: 100%;
	overflow: hidden;
}
body {
	height:100%;
}
/*coss嵌入*/
.cossembed{
	position: relative;
}
.cossembed .application-header{
	display: none;
}
.cossembed .application-left{
	display: none;
}
.cossembed .application-main{
	position: static;
	margin-top:0;
	margin-left:0; 
}
/*IE10,IE9下设置的全屏样式*/
.fullscreen{
	position: relative;
}
.fullscreen .application-header{
	display: none;
}
.fullscreen .application-left{
	display: none;
}
.fullscreen .application-main{
	position: static;
	margin-top:0;
	margin-left:0; 
}
.application-content {
	height:100%;
}
.application-header{
	position            : fixed;
	left                : 0;
	top                 : 0;
	background-color    : #22262e;
	width               : 100%;
	z-index             : 10;
	height				: 49px;
	overflow			: hidden;
}
.application-header .logo{
	margin 				: 8px 0 0 8px;
	max-height          : 36px;
}
.application-header .input-append{
	margin              : 10px 15px 0px 0px;
}
.application-header .input-append .input-search{
	position            : static;
	box-shadow          : none;
	width               : 150px;
}
.application-header .input-append .btn-search{
	margin-left         : -2px;
	border-left         : 0;
	background          : #fff;
	box-shadow          : none;
	padding             : 4px 8px;
	margin-right        : 20px
}
.application-user{
	display             : inline-block;
	overflow            : hidden;
    margin-right        : 10px;
}
.application-user .avatar{
	float               : left;
	margin-top          : 4px;
	width               : 24px;
	height              : 24px;
	margin-right        : 10px
}
.application-user .username{
	line-height         : 30px;
	color               : #999;
	font-size           : 14px;
    float 				: left;
}

/*左边菜单*/
.application-left{
	width               : 220px;
	position            : fixed;
	left                : 0;
	top                 : 49px;
	bottom              : 0;
	background-color    : #1b1e24;
	z-index             : 10;
}
.application-border{
	border-top          : #1b1e24 1px solid;
	border-bottom       : #1b1e24 1px solid;
}
.application-left .nav-list{
	margin-top: 0;
}
.application-left .nav-list>li>a{
	padding  	    	: 10px 0 11px 15px;
	text-shadow         : none;
	font-size           : 14px;
	color               : #999;
	border-top 			: 1px solid transparent;
	border-bottom 		: 1px solid transparent;
}
.application-left .nav>li.active>a,
.application-left .nav>li>a:hover,
.application-left .nav>li>a:focus{
	background-color   : transparent;
	color              : #fff;
}
.application-left .nav>li.active{
	position           : relative;
}
.application-left .nav>li.active:after{
	content            : "";
	border             : 7px solid #1b1e24;
	border-right-color : #efefef;
	font-size          : 0;
	position           : absolute;
	float              : right;
	right              : -15px;
	top                : 14px;
}
.application-left .nav-list [class^=icon-],
.application-left .nav-list [class*=" icon-"],
.application-left .nav-list>.active>a>[class^=icon-],
.application-left .nav-list>.active>a>[class*=" icon-"]{
	width: 20px;
	height: 20px;
	background-image: url(../img/icon_left_menu.png);
}
.icon-overview{
	background-position : 0 0;
}
.icon-center{
	background-position : 0 -20px;
}
.icon-server{
	background-position : 0 -105px;
}
.icon-warning{
	background-position : 0 -40px;
}
.icon-report{
	background-position : 0 -60px;
}
.icon-config{
	background-position : 0 -80px;
}

.application-menu .active i{
	background-position-x: -20px;
}

.application-left .nav>li .badge{
	float               : right;
}

/*折叠左边菜单*/
.application-btn-fold-left,
.application-btn-fold-right{
	background          : #434953;
	width               : 32px;
	height              : 28px;
	float               : right;

	/*
	position            : absolute;
	right               : 0;
	top                 : 270px; */
	cursor              : pointer;
	border-radius       : 5px 0 0 5px;
	text-align: center;
	-webkit-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s;
}

.application-btn-fold-left i{
	display: inline-block;
	width: 17px;
	height: 17px;
	margin-top: 6px;
	background: url(../img/btn_fold_left.png) -10px -6px no-repeat;
	-webkit-transition: transform 1s;
	-o-transition: transform 1s;
	transition: transform 1s;
}

.application-btn-fold-right{
	display             : none;
	background          : url(../img/btn_fold_right.png) -10px 0;
	position            : absolute;
	right               : -16px;
	width               : 16px;
	border-radius       : 0 5px 5px 0;
}

.application-menu li a{
	overflow: hidden;
}

.application-menu li i,.application-menu li p{
	float: left;
}

.application-menu li p{
	margin: 0 0 0 5px;
	width: 160px;
	height: 20px;
	overflow: hidden;
	display: inline-block;
}

.application-left .nav>li>a{
	position: relative;
}

.application-left .nav>li .badge{
	position: absolute;
	right: 15px;
	position: absolute;
	z-index: 99;
}

.application-left .nav>li>a{
	-webkit-transition-delay: .5s;
	-o-transition-delay: .5s;
	transition-delay: .5s;
}

.application-main,
.application-left,
.application-menu,
.application-menu li p,
.application-user .avatar,
.application-user .username,
.application-left .nav>li .badge{
	-webkit-transition: .6s;
	-o-transition: .6s;
	transition: .6s;
}

.hideLeft .application-left{
	width: 45px;
}

.hideLeft .application-left .nav>li .badge{
	font-weight: normal;
	padding: 1px 4px;
	right: 5px;
	top: 5px;
}

.hideLeft .application-left .nav-list{
	padding-left: 10px;
}

.hideLeft .application-left .application-menu li p{
	width: 0px;
}
.hideLeft .application-left .nav>li>a{
	border-top: 1px solid #303031;
	border-bottom: 1px solid #131416;
}

.hideLeft .application-btn-fold-right{
	/* display             : block; */
}
.hideLeft .application-main{
	margin-left         : 45px;
}

.hideLeft .application-btn-fold-left{
	width: 45px;
	border-radius: 0;
}

.hideLeft .application-btn-fold-left i{
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg);
}

@keyframes hideLeftMenu{
	from {left: 0;}
	to {left: -200px;}
}
@-ms-keyframes hideLeftMenu{
	from {left: 0;}
	to {left: -200px;}
}
@-moz-keyframes hideLeftMenu{
	from {left: 0;}
	to {left: -200px;}
}
@-webkit-keyframes hideLeftMenu{
	from {left: 0;}
	to {left: -200px;}
}

/*右边内容*/
#businessDetailView {
	overflow-y            : scroll;
	overflow-x 			  : hidden;
}
.application-main{
	margin-top          : 49px;
	margin-left         : 220px;
	background-color    : #efefef;
	padding-bottom      : 1px;
	position            : relative;
	min-width           : 1039px;
	overflow-x 			: hidden;
	
}
.application-box{
	margin              : 4px;
	border              : 1px solid #cccccc;
	background-color    : #fff;
}
/*----------框架页面end-----------*/

/*----------登录界面start-----------*/
.login-wrap{
	/*background          : -ms-linear-gradient(top, #304154, #76707a) ;    */    /* IE 10 */
	/*background          : -moz-linear-gradient(top,#304154,#76707a);*//*火狐*/ 
	/*background          : -webkit-gradient(linear, 0% 0%, 0% 100%, from(#304154), to(#76707a)); */     /* Safari 4-5, Chrome 1-9*/
	/*background          : -webkit-linear-gradient(top, #304154, #76707a);*/   /*Safari5.1 Chrome 10+*/
/*	background          : -o-linear-gradient(top, #304154, #76707a); */
	 background:radial-gradient(50% 50%, rgb(42, 97, 161), rgb(30, 72, 121));
    color: #fff;
    position: relative;
    background-color:#204b7b\9\0;
	filter              : progid:DXImageTransform.Microsoft.gradient(startColorstr=#304154,endColorstr=#76707a,grandientType=1);
	height          	: 100%;
	min-height			: 666px;
	overflow-y          : hidden;
}
.route-main-login, .route-main-login>.ember-view{
	height: 100%;
}
.login-form{
	overflow            : hidden;
    width               : 1220px;
	height              : 100%;
/*	background          : rgba(0, 0, 0, .2);
	background          : url("../img/ie8-transparent-20.png") \9;*/
	margin              : 0 auto;
}

.login-form-top{
	text-align			: center;
}

.login-form-top .system-title{
	margin				: 32px auto 0;
	line-height			: 40px;
	color				: #fff;
	font-size			: 30px;
	font-family			: 'Arial';
	text-align			: center;
	font-weight			: normal;
	position			: relative;
}

.login-form-top .system-title span{
	color               : #1898a1;
	font-size           : 24px;
}

.login-form-top .logo{
	margin				: 170px auto 0;
	width				: 584px;
	/* border-radius		: 50%;
	box-shadow			: 2px 2px #26b9a1; */
}

.login-form-top .system-name{
	margin				: 0 auto;
	line-height			: 25px;
	font-size			: 13px;
	color				: #fff;
	text-align			: center;
}

.login-form-top .system-name span{
	font-weight			: bold;
}

.login-form-main{
	width: 470px;
	height: 380px;
    margin: 170px auto;
    background: #2067a1;
    border-radius: 3px;
    overflow: hidden;
    margin-left: 55px;
    box-shadow: 0 0 0 rgba(0,0,0,.19);
}
.login-form-main .title{
	margin-top          : 20px;
	margin-bottom       : 30px;
}
.login-form-main .icon-user,
.login-form-main .icon-lock{
	opacity             : 0.4;
}
.login-user,.login-pwd{
	float: left;
    text-align: right;
    font-weight: 400;
    color: #fff;
    vertical-align: middle;
    padding-top: 7px;
    padding-bottom: 7px;
    font-family: 'Microsoft YaHei';
	font-size: 12px;
	width:25%;
	line-height: 18px;
	margin-right: 8px;
}
.login-user:before,.login-pwd:before{
	display: inline-block;
    margin-right: 4px;
    content: "*";
    font-family: SimSun;
    font-size: 12px;
    color: #f60;
}
.login-form-main .input-prepend{
	width				: 360px;
	height				: 32px;
	padding-top			: 3px;
	margin				: 12px auto 0;
/*	background			: rgba(0, 0, 0, .17);
	background          : url("../img/ie8-transparent-17.png") \9;*/
}

.login-form-main .input-prepend .add-on,.login-form-main .input-prepend .input{
	background			: none;
	border				: none;
	-webkit-box-shadow  : none;
	box-shadow          : none;
}

.login-form-main .input-prepend .add-on{
	width				: 25px;
	height				: 25px;
}

.login-form-main .input-prepend .input{
	width: 58.33333333%;
	padding: 0 10px;
    background: #116098;
    border-radius: 3px;
    outline: none;
    border: 1px solid #3986bf;
    font-size: 12px;
    height:32px;
    font-family: "Microsoft YaHei", “Helvetica Neue”, Helvetica, STHeiTi, Arial, sans-serif;
}
.login-title {
	text-align          : center;
	margin-bottom       : 40px;
    font-family         : Microsoft YaHei;
    font-size           : 24px;
    color               : #fff;
}

.login-form-main .application-btn-login{
    margin-bottom       : 5px;
    font-size           : 13px;
	width				: 230px;
	line-height			: 40px;
	background			: #2a96e3;
	text-align			: center;
	padding				: 0;
	border-radius		: 2px;
	font-size			: 16px;
	margin				: 36px 155px 0;
	display 			: block;
	color               : #fff;
	border              : 0;
	font-family: "Microsoft YaHei", â€œHelvetica Neueâ€, Helvetica, STHeiTi, Arial, sans-serif;
}
.login-form-main .application-btn-login:hover{
	background          :#3f93f9;
}

.login-form-main input::-webkit-input-placeholder { /* WebKit browsers */
    color:    #fff;
}
.login-form-main input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #fff;
}
.login-form-main input::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #fff;
}
.login-form-main input:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    #fff;
}

.login-form-main .login-error-group{
	margin				: 10px auto 0;
	min-height			: 38px;
}

.login-form .alert{
	width               : 307px;
	margin				: 0 auto;
}
.login-form-main form h2{
	padding-top         : 20px;
	padding-bottom      : 30px;
	margin              : 0;
}
.login-form-main .input-prepend{
	display: block;
	margin-bottom: 30px;
}
.login-form-main .input-prepend > input{
	width:210px;
	color: #fff;
}
.login-form-main .input-prepend > input::-webkit-input-placeholder { 
	color:#BAC1C7; 
}
.login-footer{
	position: fixed;
	bottom: 0px;
	height: 40px;
	width: 100%;
	color: #4073ad;
	background: rgba(0,0,0,.14);
}
.login-footer .p_left{
	margin-left: 40px;
	float: left;
}
.login-footer .p_right{
	margin-right: 20px;
	float: right;
}
.login-footer .p_left a{
	color: #4c98ca;
	font-size: 13px;
}
.login-footer .p_left a:hover{
	outline: 0;
	text-decoration: none;
	color: #57c5f7;
}

/*----------登录界面end-----------*/

/*----------license界面start-----------*/
.route-main-license, .route-main-license>.ember-view{
	height: 100%;
}
.license-form-main ul{
	width: 360px;
  	height: 32px;
  	line-height:32px;
  	padding: 0;
  	margin: 48px auto 20px;
	font-family:"Microsoft Yahei";
}
.license-form-main .div-prepend{
	width: 360px;
  	height: 32px;
  	line-height:32px;
  	padding-top: 3px;
  	margin: 12px auto 0; 	
	font-family:"Microsoft Yahei";
}
.license-form-main li{
	text-decoration: none;
	display: inline-block;
}
.license-form-main a{
	padding: 3px 5px; 
	color: #fff;
	height: 32px;
}
.license-form-main a:hover{
	text-decoration: none;
	cursor: pointer;
}
.license-form-main .active>a{
	color: #fff;
	font-size: 16px;
	border-radius: 2px;
}
.license-form-main .username{
	color: #fff;
	font-size: 14px;
}
.license-form-main .userNameInput{
	margin-left: 5px;
	background: rgba(0, 0, 0, .17);
	border: none;
	color: #fff;
}

.license-form-main .license-btn-ok{
	width				: 60px;
	height				: 28px;
	line-height			: 28px;
	background			: #01919a;
	text-align			: center;
	padding				: 0;
	border-radius		: 2px;
	font-size			: 14px;
	margin				: 16px auto 0;
	display 			: block;
	font-family         : "Microsoft Yahei";
}
/*----------license界面end-----------*/

/*----------组件样式重写----------*/
.apm-nav-tabs-left .nav-tabs{
	padding-left: 10px;
}



@media (max-width: 1279px) {
	.application-left{
		width: 45px;
	}

	.application-left .nav>li .badge{
		font-weight: normal;
		padding: 1px 4px;
		right: 5px;
		top: 5px;
	}

	.application-left .nav-list{
		padding-left: 10px;
	}

	.application-left .application-menu li p{
		width: 0px;
	}

	.application-left .application-user .avatar{
		margin-left: 4px;
	}

	.application-left .application-user .username{
		width: 0px;
	}

	.application-left .nav>li>a{
		border-top: 1px solid #303031;
		border-bottom: 1px solid #131416;
	}

	.application-btn-fold-left,
	.application-btn-fold-right{
		display: none;
	}
	.application-main{
		margin-left         : 45px;
	}

}
.sk-fading-circle {
  margin: 40px auto;
  width: 40px;
  height: 40px;
  position: relative; 
  display: none;}
  .sk-fading-circle .sk-circle {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0; }
  .sk-fading-circle .sk-circle:before {
    content: '';
    display: block;
    margin: 0 auto;
    width: 15%;
    height: 15%;
    background-color: #333;
    border-radius: 100%;
    -webkit-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
            animation: sk-circleFadeDelay 1.2s infinite ease-in-out both; }
  .sk-fading-circle .sk-circle2 {
    -webkit-transform: rotate(30deg);
        -ms-transform: rotate(30deg);
            transform: rotate(30deg); }
  .sk-fading-circle .sk-circle3 {
    -webkit-transform: rotate(60deg);
        -ms-transform: rotate(60deg);
            transform: rotate(60deg); }
  .sk-fading-circle .sk-circle4 {
    -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
            transform: rotate(90deg); }
  .sk-fading-circle .sk-circle5 {
    -webkit-transform: rotate(120deg);
        -ms-transform: rotate(120deg);
            transform: rotate(120deg); }
  .sk-fading-circle .sk-circle6 {
    -webkit-transform: rotate(150deg);
        -ms-transform: rotate(150deg);
            transform: rotate(150deg); }
  .sk-fading-circle .sk-circle7 {
    -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
            transform: rotate(180deg); }
  .sk-fading-circle .sk-circle8 {
    -webkit-transform: rotate(210deg);
        -ms-transform: rotate(210deg);
            transform: rotate(210deg); }
  .sk-fading-circle .sk-circle9 {
    -webkit-transform: rotate(240deg);
        -ms-transform: rotate(240deg);
            transform: rotate(240deg); }
  .sk-fading-circle .sk-circle10 {
    -webkit-transform: rotate(270deg);
        -ms-transform: rotate(270deg);
            transform: rotate(270deg); }
  .sk-fading-circle .sk-circle11 {
    -webkit-transform: rotate(300deg);
        -ms-transform: rotate(300deg);
            transform: rotate(300deg); }
  .sk-fading-circle .sk-circle12 {
    -webkit-transform: rotate(330deg);
        -ms-transform: rotate(330deg);
            transform: rotate(330deg); }
  .sk-fading-circle .sk-circle2:before {
    -webkit-animation-delay: -1.1s;
            animation-delay: -1.1s; }
  .sk-fading-circle .sk-circle3:before {
    -webkit-animation-delay: -1s;
            animation-delay: -1s; }
  .sk-fading-circle .sk-circle4:before {
    -webkit-animation-delay: -0.9s;
            animation-delay: -0.9s; }
  .sk-fading-circle .sk-circle5:before {
    -webkit-animation-delay: -0.8s;
            animation-delay: -0.8s; }
  .sk-fading-circle .sk-circle6:before {
    -webkit-animation-delay: -0.7s;
            animation-delay: -0.7s; }
  .sk-fading-circle .sk-circle7:before {
    -webkit-animation-delay: -0.6s;
            animation-delay: -0.6s; }
  .sk-fading-circle .sk-circle8:before {
    -webkit-animation-delay: -0.5s;
            animation-delay: -0.5s; }
  .sk-fading-circle .sk-circle9:before {
    -webkit-animation-delay: -0.4s;
            animation-delay: -0.4s; }
  .sk-fading-circle .sk-circle10:before {
    -webkit-animation-delay: -0.3s;
            animation-delay: -0.3s; }
  .sk-fading-circle .sk-circle11:before {
    -webkit-animation-delay: -0.2s;
            animation-delay: -0.2s; }
  .sk-fading-circle .sk-circle12:before {
    -webkit-animation-delay: -0.1s;
            animation-delay: -0.1s; }

@-webkit-keyframes sk-circleFadeDelay {
  0%, 39%, 100% {
    opacity: 0; }
  40% {
    opacity: 1; } }

@keyframes sk-circleFadeDelay {
  0%, 39%, 100% {
    opacity: 0; }
  40% {
    opacity: 1; } }
